/* You can add global styles to this file, and also import other style files */
@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';

body, html {
  height: 100%;
  margin: 0 !important;
}

body {
  background-size: 100% 100%;
  overflow: hidden;
}

.form-container {
  display: flex;
  flex-direction: column;
}

.mat-dialog-container {
  background-color: #f5f5f5;
}

.mat-dialog-content {
  max-height: calc(100vh - 100px) !important;
  min-height: 50px;
  background-color: #ffffff;
  padding: 10px 15px !important;
}

.mat-dialog-actions {
  float: right;
  font-size: 14px;
  font-weight: 300;
  color: #474747;
}

.dialog-top-bar td {
  vertical-align: middle;
}

.mat-form-field {
  width: 100%;
}

th.mat-header-cell {
  font-size: 15px;
}

/*
.item-active {
  background-color: darkcyan;
}
*/

.item-active h6 {
  color: #19b0aa;
}

/* To disable button focus outline! */
button:focus {
  outline: none !important;
}

/* For table general settings */
table {
  width: 100%;
}

.wdl-table-container-page {
  height: calc(100% - 56px);
}

.wdl-container-dialog {
  position: relative;
  height: 100%;
  box-shadow: none !important;
}

.wdl-table-container {
  position: relative;
  max-height: 100%;
  overflow: auto;
}

.wdl-table-container-small {
  position: relative;
  max-height: 100%;
  /* max-height: 300px; */
  overflow: auto;
}

.mat-tab-group, .mat-tab-body-wrapper {
  height: 100%;
}

.wdl-loading-shade {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.15);
  z-index: 102;
  display: flex;
  align-items: center;
  justify-content: center;
}

mat-icon svg {
  margin-bottom: 3px;
}

.mat-chip-list-wrapper {
  margin: -20px -4px -4px -4px !important;
}

.c-info .mat-figure {
  justify-content: left !important;
}

/*
.mat-toolbar.mat-primary {
  background: #1976d2;
}
*/
.mat-toolbar.mat-primary {
  background-color: #19b0aa;
  color: #fff;
}

.header-spacer {
  flex: 1 1 auto;
}

.hst-color {
  color: #19b0aa;
}

/*
.wdl-sub-toolbar {
  position: fixed !important;
  top: 56px;
}
*/

.app-title {
  color: #19b0aa;
  margin-right: 15px;
  font-size: 18px !important;
}

.role-mgt .mat-tab-body {
  padding: 5px 20px;
}

.wdl-checkbox figure {
  justify-content: left !important;
}

.wdl-grid-label figure {
  justify-content: flex-end !important;
}

.wdl-grid-first-label figure {
  justify-content: flex-start !important;
}

.wdl-grid-label label {
  margin-right: 10px;
}

.mat-dialog-title {
  margin: -10px 0 10px !important;
  display: flex !important;
  align-items: baseline;
  justify-content: space-between;
}

aw-wizard-navigation-bar.horizontal.large-filled-symbols ul.steps-indicator li.current:after {
  background-color: #19b0aa !important;
  color: #fff !important;
}

aw-wizard-navigation-bar.horizontal.large-filled-symbols ul.steps-indicator li.editing:after {
  background-color: darkblue !important;
  color: #fff !important;
}

.item-active svg {
  color: #19b0aa;
}

.c-info-img .mat-figure {
  justify-content: left !important;
  align-items: flex-start !important;
}

.c-info-img img {
  margin-top: 30px;
  margin-left: 20px;
  cursor: pointer;
}

.acked {
  text-decoration-line: line-through;
  text-decoration-style: double;
  text-decoration-color: black;
}

.hist-option .mat-form-field-infix {
  border-top: 0 solid transparent !important;
}

table thead tr {
  background-color:#fff !important;
}

table tr:nth-child(even) {
  background-color:#F5F5F5;
}

table tr:hover {
  background-color:#92f1ee;
}

.wdl-error {
  color: red;
}

.mat-badge-medium .mat-badge-content {
  width: 28px;
  height: 28px;
  line-height: 28px;
}

.mat-badge-content {
  text-overflow: initial !important;
}

.mat-elevation-z8 {
  box-shadow: none !important;
}
